let dataItem = {}
//获取新闻模块的tag对象
let tagMenu = document.getElementsByClassName("tag-menu")[0]
//处理tag的数据
$.ajax({
  url: '../data/newsCategory.php', //请求的url地址
  dataType: 'json', //返回格式为json
  async: true, //请求是否异步，默认为异步，这也是ajax重要特性
  cache: false, // 是否读取缓存
  data: JSON.stringify({
    module: 'news'
  }), //参数值
  // 设置请求头
  headers: {
    "Content-type": "application/json; charset=utf-8"
  },
  type: 'post', //请求方式
  beforeSend: function () {
    //请求前的处理
  },
  success: function (req) {
    //请求成功时处理
    data = req.data
    menuHeml = ``
    data.forEach((item, index) => {
      let className = ""
      // 为默认的tag添加高亮
      if (index === 0) {
        className = 'current';
      }
      //数据拼接
      menuHeml += `<a href="javascript: void(0)" data-type="${item.type}" class="${className}" onclick="loadNewsData({this:this,id: ${item.id},index:${index}})" >${item.categoryName}</a>`
    });
    // 设置数据
    tagMenu.innerHTML = menuHeml;
    //默认显示的新闻内容
    loadNewsData({
      // 默认显示第一条数据
      this: tagMenu.children[0],
      id: data[0].id,
      index: 0
    });
  },
  complete: function () {
    //请求完成的处理
  },
  error: function () {
    //请求出错处理
  },
})
// tag标签点击后显示相应的内容
function loadNewsData(params) {
  // 获取tag标签的自定义属性用于判断数据是否被请求
  let contenttype = params.this.getAttribute('data-type')
  // 获取新闻内容标签对象
  let newsWrapInfo = document.getElementById("news-wrap-info")
  // 设置当前显示的内容
  // 实现方法，通过tag标签传入的下标判断当前点击了那个tag
  // 然后实现显示
  // for (let i = 0; i < newsWrapInfo.length; i++) {
  //   newsWrapInfo[i].style.display = 'none'
  // }
  // newsWrapInfo[params.index].style.display = 'block'
  //tag标签点击高亮
  let aitem = tagMenu.children;
  for (let i = 0; i < aitem.length; i++) {
    aitem[i].className = ''
  }
  params.this.className = 'current'
  // 判断数据是否已经请求
  // if (dataRequest === 'true') {
  //   return false
  // }
  data = dataItem[contenttype];
  if (data) {
    console.log(data)
    tabContent(data, newsWrapInfo)
    return false
  }
  //ajax数据处理
  $.ajax({
    url: '../data/indexNews.php', //请求的url地址
    dataType: 'json', //返回格式为json
    data: JSON.stringify({
      // 通过tag的id属性来获取对应数据
      categoryId: params.id,
    }), //参数值
    headers: {
      "Content-type": "application/json; charset=utf-8"
    },
    type: 'post', //请求方式
    beforeSend: function () {
      //请求前的处理
    },
    success: function (req) {
      //请求成功时处理
      tabContent(req.data, newsWrapInfo)
      dataItem[contenttype] = req.data;
    },
    complete: function () {
      //请求完成的处理
    },
    error: function () {
      //请求出错处理
    },
  })
}

function tabContent(data, newsWrapInfo) {
  //获取ajax数据
  let itemHtml = `<div class="row-wrap gutter-15 padding-top-84 padding-bottom-102">`
  data.forEach(item => {
    let time = item.time.split(" ");
    //拼接数据
    itemHtml += `<div class="col-item-3"><div class="item">
        <div style="background-image:url(${item.imgUrl}" class="img-cover")>
        <img src="../image/background1.png" alt="" width="100%">
        </div>
        <div class="figure-wrap">
        <h4 class="title">${item.title}</h4>
        <time datetime="${time[0]}">${time[0]}</time>
        <i class="line"></i>
        <p class="doc">${item.dec}</p>
        <a href="" class="line-more">查看更多
          <i class="iconfont icon-jiantou1"></i>
        </a>
        </div>
      </div></div> `
  });
  itemHtml += "</div>"
  // 通过tag下标设置相应的内容
  newsWrapInfo.innerHTML = itemHtml;
  // // 将tag自定义属性设置为true表示数据已经请求
  // // params.this.setAttribute("data-request", 'true');

}